import React from "react";
import { View, Text, TouchableHighlight } from "react-native";
import SplashScreen from "react-native-splash-screen";

import * as vars from "../../theme";

import styles from "./styles";

class index extends React.Component {
  static navigationOptions = {
    header: null,
    title: "No Header",
  };

  componentDidMount() {
    setTimeout(() => {
      // dispatch({ type: "modal/changeVisible", payload: true }); // 打开全局通知
      SplashScreen.hide();
    }, 3000);
  }

  localOnClickItem = type => {
    const { navigation } = this.props;
    navigation.navigate(type);
  };

  render() {
    return (
      <View style={styles.root}>
        <TouchableHighlight
          style={styles.item}
          onPress={this.localOnClickItem.bind(this, "Demo1")}
          underlayColor={vars.ColorPrimaryActive}
        >
          <Text style={styles.text}>FlatList 滚动测试</Text>
        </TouchableHighlight>
        <TouchableHighlight
          style={styles.item}
          onPress={this.localOnClickItem.bind(this, "Demo2")}
        >
          <Text style={styles.text}>Img Blur 测试</Text>
        </TouchableHighlight>
        <TouchableHighlight
          style={styles.item}
          onPress={this.localOnClickItem.bind(this, "Demo3")}
        >
          <Text style={styles.text}>拖拽</Text>
        </TouchableHighlight>
        <TouchableHighlight
          style={styles.item}
          onPress={this.localOnClickItem.bind(this, "Demo3")}
        >
          <Text style={styles.text}>SnapCarousel</Text>
        </TouchableHighlight>
      </View>
    );
  }
}

export default index;
